{% extends 'base_dashboard.html' %}
{% load site_tags %}

{% block title %}Certification applications — {{ site_settings.institute_name }}{% endblock %}

{% block content %}
<div class="d-flex justify-content-between mb-4 flex-wrap gap-2">
  <div>
    <h4 class="fw-bold mb-1">Certification applications</h4>
    <p class="text-muted small mb-0">
      Review manual payment screenshots before approval. Stripe payments approve automatically.
    </p>
  </div>
  <a href="?needs_review=1" class="btn btn-outline-warning btn-sm">
    Needs review ({{ pending_count }})
  </a>
</div>

<div class="card border-0 shadow-sm rounded-4">
  <div class="table-responsive">
    <table class="table mb-0 align-middle">
      <thead class="table-light">
        <tr>
          <th class="ps-4">Candidate</th>
          <th>Program</th>
          <th>Amount due</th>
          <th>Status</th>
          <th>Payment</th>
          <th class="pe-4 text-end">Actions</th>
        </tr>
      </thead>
      <tbody>
        {% for app in applications %}
        <tr>
          <td class="ps-4">
            <div class="fw-semibold">{{ app.candidate.get_display_name }}</div>
            <div class="small text-muted">{{ app.candidate.email }}</div>
          </td>
          <td>{{ app.program.title }}</td>
          <td>
            {% format_price app.current_fee_due %}
            {% if app.status == 'pending_reattempt_payment' %}
              <div class="small text-muted">Reattempt</div>
            {% endif %}
          </td>
          <td><span class="badge text-bg-secondary">{{ app.get_status_display }}</span></td>
          <td>
            {{ app.payment_method|default:"—" }}
            {% if app.payment_kind %}<span class="small text-muted">({{ app.payment_kind }})</span>{% endif %}
            {% if app.payment_proof %}
              <div class="small text-success mt-1"><i class="bi bi-image me-1"></i>Proof attached</div>
            {% elif app.status == 'pending_payment' or app.status == 'pending_reattempt_payment' %}
              <div class="small text-muted mt-1">No proof yet</div>
            {% endif %}
            {% if app.payment_rejection_reason %}
              <div class="small text-danger mt-1">Rejected — awaiting new proof</div>
            {% endif %}
          </td>
          <td class="pe-4 text-end">
            <div class="d-inline-flex flex-wrap gap-1 justify-content-end">
              <a href="{% url 'certifications:admin_application_detail' app.pk %}"
                 class="btn btn-sm btn-outline-primary">
                {% if app.payment_proof %}View proof{% else %}View{% endif %}
              </a>
              {% if app.status == 'pending_payment' or app.status == 'pending_reattempt_payment' %}
                {% if app.payment_proof %}
                <form method="post" action="{% url 'certifications:admin_approve' app.pk %}" class="d-inline">
                  {% csrf_token %}
                  <button class="btn btn-sm btn-success"
                          onclick="return confirm('Approve after checking the payment screenshot?');">
                    Approve
                  </button>
                </form>
                <a href="{% url 'certifications:admin_application_detail' app.pk %}"
                   class="btn btn-sm btn-outline-danger">Reject</a>
                {% endif %}
              {% elif app.status == 'paid' or app.status == 'awaiting_proctor' %}
                <a href="{% url 'certifications:proctor_create' app.pk %}" class="btn btn-sm btn-outline-primary">Proctor</a>
              {% endif %}
            </div>
          </td>
        </tr>
        {% empty %}
        <tr><td colspan="6" class="text-center text-muted py-5">No applications.</td></tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
</div>
{% endblock %}